<template>
  <!-- 无子级 -->
  <el-menu-item v-if="!item.child" :index="item.url">
      <el-icon><component :is="item.icon"></component></el-icon>
      <span>{{item.name}}</span>
  </el-menu-item>
  <!-- 有子级 -->
  <el-sub-menu :index="item.url" v-else>
      <template #title>
          <el-icon><component :is="item.icon"></component></el-icon>
          <span>{{item.name}}</span>
      </template>
      <NavItem v-for="sub in item.child" :key="sub.url" :item="sub" />
  </el-sub-menu>
  </template>
  
  <script setup>
  import {reactive,defineProps} from 'vue'
  const {item} = defineProps({
      item:{
          type:Object
      }
  })
  
  </script>